(function () {
    // 导航栏鼠标经过和鼠标点击添加背景图片
    var lis = document.querySelector('.wq_job').querySelectorAll('li')
    for (let i = 0; i < lis.length; i++) {
        lis[i].setAttribute('index', i)
        lis[i].setAttribute("status", "unclick")
        if (lis[i].querySelectorAll('a').length > 0) {
            lis[i].style.cursor = 'default';
        }
        lis[i].addEventListener('click', function (e) {
            e.stopPropagation();
            if (this.querySelectorAll('a').length == 0) {
                for (let j = 0; j < lis.length; j++) {
                    lis[j].style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav1_244b35a2.webp)';
                    lis[j].setAttribute("status", "unclick")
                }
                $('.sub-nav a').removeClass('active');
                $('.sub-nav a').css({
                    backgroundPosition: '0 0',
                    color: 'black',
                })
                this.style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav2_a82e2d18.webp)';
                this.setAttribute('status', "click")
                var index = this.getAttribute('index');
                $('#wq .item').fadeOut();
                $('#wq .item').eq(index).fadeIn();
                $('.btn_gender a').removeClass('active');
                $('#wq .item').eq(index)[0].querySelectorAll('.btn_gender a')[0].classList.add('active');
                $('.sub-nav a').removeClass('active');
            }
        })
        lis[i].addEventListener('mouseenter', function () {
            this.style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav2_a82e2d18.webp)'
        })
        lis[i].addEventListener('mouseleave', function () {
            if (this.getAttribute('status') == "unclick") {
                this.style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav1_244b35a2.webp)'
            } else {
                this.style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav2_a82e2d18.webp)'
            }
        })
    }

    // 鼠标经过显示二级导航菜单
    var sub_nav = document.querySelectorAll('.sub-nav');
    for (let i = 0; i < sub_nav.length; i++) {
        var a_list = sub_nav[i].querySelectorAll('a');
        for (let j = 0; j < a_list.length; j++) {
            a_list[j].addEventListener('mouseover', function () {
                this.style.backgroundPosition = '0 bottom'
                this.style.color = '#fff'
            })
            a_list[j].addEventListener('mouseout', function () {
                if (this.className.includes('active')) {
                    return false
                }
                this.style.backgroundPosition = '0 0'
                this.style.color = 'black'
            })
            a_list[j].addEventListener('click', function (e) {
                e.stopPropagation();
                if (this.classList.contains('active')) {
                    return false
                } else {
                    let that = this;
                    $('.sub-nav a').removeClass('active');
                    $('.sub-nav a').css({
                        backgroundPosition: '0 0',
                        color: 'black',
                    })
                    $(this).css({
                        backgroundPosition: '0 bottom',
                        color: '#fff',
                    })
                    this.classList.add('active');
                    $('.btn_gender a').removeClass('active');
                    $('#wq .item').fadeOut();
                    $('.wq_job li').each(function (ai, li) {
                        li.setAttribute("status", "unclick");
                        li.style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav1_244b35a2.webp)';
                        li.setAttribute('stauts', 'unclick');
                        $(li).find('a').each(function (bj, a) {
                            if (that === a) {
                                li.style.backgroundImage = 'url(./images/wqimage/wq-userimage/nav2_a82e2d18.webp)';
                                li.setAttribute('status', 'click');
                                $('#wq .item').eq(ai).fadeIn();
                            }
                        })
                    })
                    switch (this.getAttribute('data-class')) {
                        case "sub_daofa":
                            var daofa = document.querySelector('.wq_jobon_daofa') || document.querySelector('.wq_jobon_tianlang');
                            daofa.className = ' item wq_jobon_daofa';
                            daofa.querySelectorAll('.btn_gender a')[0].setAttribute('data-man', './images/wqimage/wq-userimage/daofa-male_e1d13a1a.webp');
                            daofa.querySelectorAll('.btn_gender a')[1].setAttribute('data-woman', './images/wqimage/wq-userimage/daofa-fe_23c86e2d.webp');
                            daofa.querySelectorAll('.btn_gender a')[0].classList.add('active');
                            daofa.querySelectorAll('.name_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-nameimage/daofa-male_df0535fd.webp)';
                            daofa.querySelectorAll('.rol_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-userimage/daofa-male_e1d13a1a.webp)';
                            break;
                        case "sub_tianlang":
                            var tianlang = document.querySelector('.wq_jobon_daofa') || document.querySelector('.wq_jobon_tianlang');
                            tianlang.className = ' item wq_jobon_tianlang';
                            tianlang.querySelectorAll('.btn_gender a')[0].setAttribute('data-man', './images/wqimage/wq-userimage/tianlang-male_9d2a4217.webp');
                            tianlang.querySelectorAll('.btn_gender a')[1].setAttribute('data-woman', './images/wqimage/wq-userimage/tianlang-fe_a109785d.webp');
                            tianlang.querySelectorAll('.btn_gender a')[0].classList.add('active');
                            tianlang.querySelectorAll('.name_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-nameimage/tianlang-male_d9fe1e49.webp)';
                            tianlang.querySelectorAll('.rol_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-userimage/tianlang-male_9d2a4217.webp)';
                            break;
                        case "sub_zhanhun":
                            var zhanhun = document.querySelector('.wq_jobon_zhanhun') || document.querySelector('.wq_jobon_jingang');
                            zhanhun.className = ' item wq_jobon_zhanhun';
                            zhanhun.querySelectorAll('.btn_gender a')[0].setAttribute('data-man', './images/wqimage/wq-userimage/zhanhun-male_58b7ccb1.webp');
                            zhanhun.querySelectorAll('.btn_gender a')[1].setAttribute('data-woman', './images/wqimage/wq-userimage/zhanhun-fe_5ebe8463.webp');
                            zhanhun.querySelectorAll('.btn_gender a')[0].classList.add('active');
                            zhanhun.querySelectorAll('.name_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-nameimage/zhanhun-male_7712c9b7.webp)';
                            zhanhun.querySelectorAll('.rol_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-userimage/zhanhun-male_58b7ccb1.webp)';
                            break;
                        case "sub_jingang":
                            var jingang = document.querySelector('.wq_jobon_zhanhun') || document.querySelector('.wq_jobon_jingang');
                            jingang.className = ' item wq_jobon_jingang';
                            jingang.querySelectorAll('.btn_gender a')[0].setAttribute('data-man', './images/wqimage/wq-userimage/jingang-male_8d5f9fb8.webp');
                            jingang.querySelectorAll('.btn_gender a')[1].setAttribute('data-woman', './images/wqimage/wq-userimage/jingang-fe_32080775.webp');
                            jingang.querySelectorAll('.btn_gender a')[0].classList.add('active');
                            jingang.querySelectorAll('.name_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-nameimage/jingang-male_05144a15.webp)';
                            jingang.querySelectorAll('.rol_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-userimage/jingang-male_8d5f9fb8.webp)';
                            break;
                        case "sub_duanhen":
                            var duanhen = document.querySelector('.wq_jobon_duanhen') || document.querySelector('.wq_jobon_cangren');
                            duanhen.className = ' item wq_jobon_duanhen';
                            duanhen.querySelectorAll('.btn_gender a')[0].setAttribute('data-man', './images/wqimage/wq-userimage/duanhen-male_f98d20c7.webp');
                            duanhen.querySelectorAll('.btn_gender a')[1].setAttribute('data-woman', './images/wqimage/wq-userimage/duanhen-fe_5ecead59.webp');
                            duanhen.querySelectorAll('.btn_gender a')[0].classList.add('active');
                            duanhen.querySelectorAll('.name_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-nameimage/duanhen-male_e94ecac0.webp)';
                            duanhen.querySelectorAll('.rol_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-userimage/duanhen-male_f98d20c7.webp)';
                            break;
                        case "sub_cangren":
                            var cangren = document.querySelector('.wq_jobon_duanhen') || document.querySelector('.wq_jobon_cangren');
                            cangren.className = ' item wq_jobon_cangren';
                            cangren.querySelectorAll('.btn_gender a')[0].setAttribute('data-man', './images/wqimage/wq-userimage/cangren-male_c84b7656.webp');
                            cangren.querySelectorAll('.btn_gender a')[1].setAttribute('data-woman', './images/wqimage/wq-userimage/cangren-fe_2b6cbc72.webp');
                            cangren.querySelectorAll('.btn_gender a')[0].classList.add('active');
                            cangren.querySelectorAll('.name_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-nameimage/cangren-male_8f9f9611.webp)';
                            cangren.querySelectorAll('.rol_psin')[0].style.backgroundImage = 'url(./images/wqimage/wq-userimage/cangren-male_c84b7656.webp)';
                            break;
                    }
                }
            })

        }
    }

    // 人物性别切换按钮
    var switchSex = document.querySelectorAll('.btn_gender')
    for (let i = 0; i < switchSex.length; i++) {
        switchSex[i].querySelectorAll('a')[0].addEventListener('click', function () {
            $('.btn_gender a').removeClass('active');
            this.classList.add('active')
            var url = this.getAttribute('data-man');
            document.querySelectorAll('.wq_role')[i].style.backgroundImage = 'url(' + url + ')';
        })
        switchSex[i].querySelectorAll('a')[1].addEventListener('click', function () {
            $('.btn_gender a').removeClass('active');
            this.classList.add('active')
            var url = this.getAttribute('data-woman');
            document.querySelectorAll('.wq_role')[i].style.backgroundImage = 'url(' + url + ')';
        })
    }


})()
